<template>
  <div>
    <pdf-card>
      <template #pdf-head-left>
        <span> {{ Object.keys(pdfData)[0] }} </span>
      </template>
      <template #pdf-body>
        <div class="pdf-option">
          <div v-for="item in pdfData[Object.keys(pdfData)[0]]" :key="item.id">
            <pdf-option :pdfData="item"></pdf-option>
          </div>
        </div>
      </template>
    </pdf-card>
  </div>
</template>

<script setup lang="ts">
import pdfCard from "@/components/pdfCard.vue";
import pdfOption from "@/components/pdfOption.vue";
import {defineProps} from "vue"
  const props =  defineProps({
    pdfData: {
      type: Object,
      default: () => ({}),
    }
})
</script>

<style lang="scss" scoped>
.pdf-option {
  display: flex;
  flex-wrap: wrap;
}
</style>